<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8" isELIgnored="false"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/fmt"  prefix="fmt"%>
<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions"%>
<%
    String path = request.getContextPath();
    String basePath = request.getScheme() + "://"
            + request.getServerName() + ":" + request.getServerPort()
            + path;
%>
<script type="text/javascript" src="<%=path%>/bootstrap/js/jquery-3.4.1.min.js"></script>
<script type="text/javascript" src="<%=path%>/bootstrap/js/jquery-3.4.1.js"></script>
<link href="http://cdn.bootcss.com/twitter-bootstrap/2.2.2/css/bootstrap.min.css" rel="stylesheet">
<link href="http://www.bootcss.com/p/bootstrap-datetimepicker/bootstrap-datetimepicker/css/datetimepicker.css" rel="stylesheet">
<script src="http://cdn.bootcss.com/bootstrap/3.3.0/js/bootstrap.min.js"></script>
<script src="http://www.bootcss.com/p/bootstrap-datetimepicker/bootstrap-datetimepicker/js/bootstrap-datetimepicker.min.js"></script>

<script type="text/javascript">
	function comsumeDeleteOrActive(comsumeId,disabled) {
		if (confirm("您确定删除这条记录吗？")) {
			window.location="deleteOrActive?id="+comsumeId+"&disabled="+disabled
		}
	}
	
	$(document).ready(function () {
		$("#comsume").addClass("active");
	});
</script>
<style type="text/css">
	.span6{
		width: 0px;
		height: 0px;
		padding-top: 0px;
		padding-bottom: 0px;
		margin-top: 0px;
		margin-bottom: 0px;
	}
</style>
<div class="data_list">
	<div class="data_list_title">
		消费记录管理
	</div>
	<form action="comsume/list" name="myFrom" class="form-search" method="post">
		<button class="btn btn-success" type="button" style="margin-right: 50px;" onclick="javascript:window.location='action=preAdd'">添加</button>
		<span class="data_search">
			<select id="searchType" name="searchType" style="width: 80px;">
				<option value="date">日期</option>
				<option value="name">游艇名称</option>
				<option value="tel">会员电话</option>
			</select>
			&nbsp;<input id="keyword" name="keyword" type="text" value="${keyword}" style="width: 120px;height: 30px;">
			&nbsp;<button type="submit" class="btn btn-info" onkeydown="if(event.keyCode==13)myForm.submit()"> 搜索</button>
		</span>
	</form>
	<div>	
		<table class="table table-striped table-bordered table-hover datatable">
			<thead>
				<tr>
					<th>日期</th>
					<th>会员电话</th>
					<th>会员</th>
					<th>游艇名称</th>
					<th>消费金额</th>
				</tr>
			</thead>
			<tbody>
				<!-- items表示遍历的元素 var表示当前集合中每一个元素 varStatus表示循环状态的变量名 -->
				<c:forEach items="${comsumes}" var="comsume">
					<tr>
						<td><fmt:formatDate value="${comsume.date}" pattern="yyyy-MM-dd"/></td>
						<td>${comsume.user.tel}</td>
						<td>${comsume.user.name}</td>
						<td>${comsume.yacht.name}</td>
						<td>${comsume.money}</td>	
						<td>
							<button class="btn btn-mini btn-info" type="button" onclick="javascript:window.location='preUpdate?id=${comsume.id}'">修改</button>
							<c:if test="${comsume.disabled==0}">
								<button class="btn btn-mini btn-danger" type="button" onclick="comsumeDeleteOrActive(${comsume.id},1)">删除</button>
							</c:if>
							<c:if test="${comsume.disabled==1}">	
								<button class="btn btn-mini btn-danger" type="button" onclick="comsumeDeleteOrActive(${comsume.id},0)">激活</button>
							</c:if>
						</td>	
					</tr>
				</c:forEach>
			</tbody>
		</table>
	</div>
</div>
